<script setup>
</script>

<template>
  <div>
    <el-menu background-color="#545c64" text-color="#ffffff" active-text-color="#ffd04b" router>
      <el-menu-item index="/index/mapIndex"><el-icon>
          <HomeFilled />
        </el-icon>初始化
      </el-menu-item>
      <el-menu-item index="/index/mapView"><el-icon>
          <View />
        </el-icon>地图视角</el-menu-item>
      <el-sub-menu>
        <template #title><el-icon>
            <Location />
          </el-icon><span>模型和数据</span></template>
        <el-menu-item index="/index/mapModel-3dTiles">3dTiles</el-menu-item>
        <el-menu-item index="/index/mapModel-geojson">geojson</el-menu-item>
        <el-menu-item index="/index/mapModel-gltf">gltf</el-menu-item>
      </el-sub-menu>

      <el-sub-menu>
        <template #title>
          <el-icon>
            <Histogram />
          </el-icon><span>效果</span>
        </template>
        <el-menu-item index="/index/mapEffect-heatmap1">热力图1</el-menu-item>
        <el-menu-item index="/index/mapEffect-heatmap2">热力图2</el-menu-item>
        <el-menu-item index="/index/mapEffect-water">水流</el-menu-item>
      </el-sub-menu>
    </el-menu>
  </div>
</template>

<style scoped>
.el-menu-vertical-demo {
  height: 100%;
}
</style>